<template>
	<view class="page-mine">
		<div class="flex flex-direction justify-center align-center">
			<image class="logo" src="/static/logo.png"></image>
			<view class="text-area margin-tb">
				<text class="title">{{title}}</text>
			</view>
		</div>
		
		<u-cell-group>
			<u-cell @click="navigateTo(3)" size="large" title="flex布局" isLink></u-cell>
			<u-cell @click="navigateTo(3)" size="large" title="内外边距" isLink></u-cell>
		</u-cell-group>
		<view style="height: 16rpx;"></view>
		<u-cell-group>
			<u-cell @click="navigateTo(1)" size="large" title="个人设置" isLink></u-cell>
			<u-cell @click="onService" size="large" title="联系客服" isLink></u-cell>
			<u-cell @click="navigateTo(2)" size="large" title="关于App名称" label="仿微信关于我们" :value="version" isLink></u-cell>
		</u-cell-group>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				version: '1.0.0'
			}
		},
		onLoad() {
			// #ifdef APP-PLUS
			// 获取版本号
			plus.runtime.getProperty(plus.runtime.appid, wgtinfo => {
				this.version = wgtinfo.version;
			});
			// #endif
		},
		methods: {
			/**
			 * 跳转
			 * @param {Number} index = [value] 
			 */
			navigateTo(index){
				switch (index){
					case 1:
						uni.navigateTo({
							url: '/pages/mine/setting'
						})
						break;
					case 2:
						uni.navigateTo({
							url: '/pages/mine/about'
						})
						break;
					case 3:
						uni.navigateTo({
							url: '/pages/mine/flex'
						})
						break;
					default:
						break;
				}
			},
			
			// 联系客服
			onService(){
				let chatbot = 'https://chatbot.weixin.qq.com/webapp/G0P0UC7pKxGMPr9drbB4cKEQFuNPG3?robotName=智能小助手';
				uni.navigateTo({
					url: '/pages/webview/webview?url=' + chatbot
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page-mine {
		.logo{
			width: 200rpx;
			height: 200rpx;
			margin-top: 20%;
		}
	}
</style>